<ion-header>
  <ion-toolbar class="toolbar-head">
    <ion-buttons slot="start" mode='ios'>
      <ion-back-button defaultHref=""  text=""></ion-back-button>
    </ion-buttons>
    <ion-title>My Orders </ion-title>
    <!-- <ion-label slot="end" style="color: white; font-size: 0.8rem;padding-right: 5px;">所有订单</ion-label> -->
  </ion-toolbar>
</ion-header>
<ion-content>
  <ion-segment (ionChange)="segmentChanged($event)" [(ngModel)]="menuIndex" scrollable='false' class="segment-btn">
    <ion-segment-button value="{{item.id}}" *ngFor="let item of menuList">
      <ion-label>{{item.value}}</ion-label>
      <div *ngIf="item.select" style="width:40px;height:3px;margin-top: 5px; background:#000;border-radius:2px;">
      </div>
      <div *ngIf="!item.select" style="width:40px;height:3px;margin-top: 5px; background:#fff;border-radius:2px;">
      </div>
    </ion-segment-button>
  </ion-segment>
  <div>
    <div class="order-item" *ngFor="let item of orderList">
      <ion-label class="order-number-str">Order number:</ion-label>
      <span class="order-number">{{item.orderId}}</span>
      <label class="order-type">{{item.procOrderStatusStr}}</label>
      <div class="order-item-content" *ngFor="let it of item.array"  (click)="onClickItem(it)">
        <img src="{{imageUrl+it.procImg}}" onerror="this.src='../../../../assets/img/zhanshi3.png';this.onerror=null" alt="">
        <div class="order-item-content-text">
          <p style="font-size: 0.8rem;">
            <label style="color:#4D4D4D;">{{it.procName}}</label>
            <span class="order-item-content-text-span">${{AmountOfConversion(it.procCashPrice)}}</span>
          </p>
          <p style="font-size: 0.7rem;margin-top: 6px;">
            <label style="color:#AAAAAA">Size:{{it.size}}</label>
          </p>
          <p style="font-size: 0.7rem;margin-top: 6px;">
            <label style="color:#AAAAAA">Color:{{it.color}}</label>
          </p>
          <p style="font-size: 0.7rem;margin-top: 6px;">
            <label style="color:#010101;"></label>
            <span class="order-item-content-text-span-1">x{{it.num}}</span>
          </p>
        </div>
      </div>
      <div class="order-item-food">
        <ion-label style="color:rgba(102,102,102,1)">Order date:</ion-label>
        <label style="color:rgba(102,102,102,1)">{{strFormatData(item.orderDate)}} {{item.orderTime}}</label>
        <span style="float: right;color:rgba(102,102,102,1);">Total：${{AmountOfConversion(item.orderAmt)}}</span>
      </div>
      <!-- <div class="btn" (click)="btn()" *ngIf="item.procOrderStatus=='3'">
        <button>去付款</button>
      </div> -->
      <div class="btn" (click)="onComment(item)" *ngIf="item.procOrderStatus=='0'">
        <button>Add a review </button>
      </div> 
       <div class="btn"  *ngIf="item.procOrderStatus=='4'">
        <button (click)="logistics(item)">Track package  </button>
        <button (click)="btnOK(item)">Confirm received  </button>
      </div>
      <!-- <div class="btn" (click)="onComment(item)" *ngIf="item.procOrderStatus!='0'">
        <button>测试订单评论</button>
      </div> -->

    </div>


    <!-- <div class="order-item">
  <ion-label class="order-number-str">订单编号：</ion-label>
  <span class="order-number">CB93894974874</span>
  <label class="order-type">Shipped</label>
  <div class="order-item-content">
    <img src="../../../../assets/img/zhanshi3.png" alt="">
    <div class="order-item-content-text">
      <p style="font-size: 0.8rem;">
        <label style="color:#4D4D4D;">商品名称</label>
        <span class="order-item-content-text-span">￥2999</span>
      </p>
      <p style="font-size: 0.7rem;margin-top: 6px;">
        <label style="color:#AAAAAA">规格： 蓝白</label>
      </p>
      <p style="font-size: 0.7rem;margin-top: 6px;">
        <label style="color:#010101;">订单时间：2019-11-08</label>
        <span class="order-item-content-text-span-1">x1</span>
      </p>
    </div>
  </div>
  
</div> -->
    <!-- <div class="btn">
  <button>去付款</button>
</div> -->

  </div>


</ion-content>